<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
 <link href="assets/css/bootstrap.min.css" rel="stylesheet" />
        <link rel="stylesheet" href="css/style.css"/>       
        <link href="assets/css/codemirror.css" rel="stylesheet">
        <link rel="stylesheet" href="assets/css/ace.min.css" />
    <link rel="stylesheet" href="assets/css/jquery.pagination.css" />
        <link rel="stylesheet" href="font/css/font-awesome.min.css" />
        <!--[if lte IE 8]>
		  <link rel="stylesheet" href="assets/css/ace-ie.min.css" />
		<![endif]-->
		<script src="js/jquery-1.9.1.min.js"></script>
		<script src="assets/js/typeahead-bs2.min.js"></script>   
        <script src="js/lrtk.js" type="text/javascript" ></script>		
		<script src="assets/js/jquery.dataTables.min.js"></script>
    <script src="assets/js/jquery.pagination.min.js"></script>
		<script src="assets/js/jquery.dataTables.bootstrap.js"></script>
        <script src="assets/layer/layer.js" type="text/javascript" ></script>          
        <script type="text/javascript" src="Widget/swfupload/swfupload.js"></script>
        <script type="text/javascript" src="Widget/swfupload/swfupload.queue.js"></script>
        <script type="text/javascript" src="Widget/swfupload/swfupload.speed.js"></script>
        <script type="text/javascript" src="Widget/swfupload/handlers.js"></script>
<title>广告管理</title>
    <style type="text/css">
        .img{
            width: 30%;
            height: 30%;
            display: none;
        }
        .tuimg{
            width: 80px;
            height:80px;
        }
        #table_img{
            height: auto;
            width: 100%;
        }
        #table_img tbody tr{
            border-collapse: separate;
            border-spacing:0px 5px;
        }
        #ttu{
            /*display: none;*/
            position:fixed;
            background-color: #0b6cbc;
            width: 200px;
            height: 200px;
            border: 1px solid #0b6cbc;
        }
    </style>
</head>

<body>
<div class=" clearfix" id="advertising">
       <div id="scrollsidebar" class="left_Treeview">
    <div class="show_btn" id="rightArrow"><span></span></div>
    <div class="widget-box side_content" >
    <div class="side_title"><a title="隐藏" class="close_btn"><span></span></a></div>
     <div class="side_list">
      <div class="widget-header header-color-green2">
          <h4 class="lighter smaller">广告图分类</h4>
      </div>
      <div class="widget-body">
         <ul class="b_P_Sort_list">
             <li><i class="orange  fa fa-user-secret"></i><a href="#" class="qietu" name="0">全部</a></li>
             <!--<li><i class="fa fa-image pink "></i><a href="#" class="qietu" name="1">全屏图</a></li>
             <li> <i class="fa fa-image pink "></i> <a href="#" class="qietu" name="2">半屏图</a></li>-->
         </ul>
  </div>
  </div>
  </div>  
  </div><div class="Ads_list">
   <div class="border clearfix">
       <span class="l_f">
        <a href="javascript:ovid()" id="ads_add" class="btn btn-warning"><i class="fa fa-plus"></i> 添加广告</a>
       </span>
     </div>
     <div class="Ads_lists">
         <div id="za">
             <table id="table_img">
                 <tbody></tbody>
             </table>
         </div>
         <div id="zb">
             <div class="box">
                 <div id="pagination1" class="page fl"></div>
             </div>
         </div>

     </div>
 </div>
</div>
<!--添加广告样式-->
<div id="add_ads_style"  style="display:none">
 <div class="add_adverts">

     <form id="tf">
         <div id="tua">
         <label class="label_name">图片类型</label>
         <span class="cont_style">
  <select id="imatypes" class="tub" na="图片类型" name="imageType">
    <option value="">选择分类</option>
    <option value="1">全屏图</option>
    <option value="2">半屏图</option>
  </select></span><br/>
             图片：<input type="file" na="图片" id="file" class="file" name="file"><span><img src="" class="img"></span>
         </div>
     </form>


 </div>
</div>
<div id="ttu">

</div>
</body>
</html>
<script>
//初始化宽度、高度  
 $(".widget-box").height($(window).height()); 
 $(".Ads_list").width($(window).width()-220);
  //当文档窗口发生改变时 触发  
    $(window).resize(function(){
	$(".widget-box").height($(window).height());
	 $(".Ads_list").width($(window).width()-220);
	});
	$(function() { 
	$("#advertising").fix({
		float : 'left',
		//minStatue : true,
		skin : 'green',	
		durationTime :false,
		stylewidth:'220',
		spacingw:30,//设置隐藏时的距离
	    spacingh:250,//设置显示时间距
		set_scrollsidebar:'.Ads_style',
		table_menu:'.Ads_list'
	});
});


/*******添加广告*********/

$(".file").change(function(){
    $('.img').css('display','block');
    $(".img").attr("src",URL.createObjectURL($(this)[0].files[0]));
});

 $('#ads_add').on('click', function(){
	  layer.open({
        type: 1,
        title: '添加广告',
		maxmin: true, 
		shadeClose: false, //点击遮罩关闭层
        area : ['800px' , ''],
        content:$('#add_ads_style'),
		btn:['提交','取消'],
		yes:function(index,layero){	
		 var num=0;
		 var str="";
            $("#file,.tub").each(function(n){
                if($(this).val()=="")
                {
                    layer.alert(str+=""+$(this).attr("na")+"不能为空！\r\n",{
                        title: '提示框',
                        icon:0,
                    });
                    num++;
                    return false;
                }
            });

		  if(num>0){  return false;}	 	
          else{
              var form = new FormData(document.getElementById("tf"));
              $.ajax({
                  url:"http://localhost/upload",
                  type:"post",
                  data:form,
                  processData:false,
                  contentType:false,
                  success:function(data){
                      layer.alert('添加成功！',{
                          title: '提示框',
                          icon:1,
                      });
                      layer.close(index);
                      window.location.reload();
                  },
                  error:function(e){
                      alert("错误！！");
                      window.clearInterval(timer);
                  }
              });
		  }		  		     				
		}
    });
})
</script>
<script type="text/javascript">


    $(function(){
        var totalPage="2";
        var bu="删除";
        $.ajax({
            url:"http://localhost/selectImages",
            type:"post",
            dataType:"json",
            data:{},
            async: false,
            traditional: true,
            success:function(data){
                totalPage=data.pa;
                if(data.number>0){
                for ( var i in data.datas) {
                    if (data.datas[i].IMAGE_TYPE==1){
                        $("#table_img tbody").append("<tr><td><a target='_blank' href="+data.datas[i].IMAGE_URL+"><img class='tuimg' src="+data.datas[i].IMAGE_URL+"/></a></td><td>"+data.datas[i].IMAGE_TIME+"</td><td>全屏图</td><td><button  type='button' onclick='shan(this)' name='"+data.datas[i].IMAGE_ID+"' class='btn btn-primary'>"+bu+"</button></td></tr>");
                    }else{
                        $("#table_img tbody").append("<tr><td><a target='_blank' href="+data.datas[i].IMAGE_URL+"><img class='tuimg' src="+data.datas[i].IMAGE_URL+"/></a></td><td>"+data.datas[i].IMAGE_TIME+"</td><td>半屏图</td><td><button  type='button' onclick='shan(this)' name='"+data.datas[i].IMAGE_ID+"' class='btn btn-primary'>"+bu+"</button></td></tr>");
                    }
                }
                }else{
                    layer.alert('暂无广告图片！',{
                        title: '提示框',
                        icon:1,
                    });
                    layer.close(index);
                }

            },
            error:function(){
                alert("您没有相应的权限,请联系管理员");
            }
        })

        $("#pagination1").pagination({
            currentPage: 1,
            totalPage:totalPage,
            callback: function(current) {
                $.ajax({
                    url:"http://localhost/selectImages",
                    type:"post",
                    dataType:"json",
                    data:{'page':current},
                    async: false,
                    traditional: true,
                    success:function(data){
                        $("#table_img tbody").empty();
                        if(data.datas[0].IMAGE_ID!=null){
                        for ( var i in data.datas) {
                            if (data.datas[i].IMAGE_TYPE==1){
                                $("#table_img tbody").append("<tr><td><a target='_blank' href="+data.datas[i].IMAGE_URL+"><img class='tuimg' src="+data.datas[i].IMAGE_URL+"/></a></td><td>"+data.datas[i].IMAGE_TIME+"</td><td>全屏图</td><td><button   type='button' onclick='shan(this)' name='"+data.datas[i].IMAGE_ID+"' class='btn btn-primary'>"+bu+"</button></td></tr>");
                            }else{
                                $("#table_img tbody").append("<tr><td><a target='_blank' href="+data.datas[i].IMAGE_URL+"><img class='tuimg' src="+data.datas[i].IMAGE_URL+"/></a></td><td>"+data.datas[i].IMAGE_TIME+"</td><td>半屏图</td><td><button  type='button' onclick='shan(this)' name='"+data.datas[i].IMAGE_ID+"' class='btn btn-primary'>"+bu+"</button></td></tr>");
                            }
                        }
                        }
                    },
                    error:function(){
                        alert("您没有相应的权限,请联系管理员");
                    }
                })

            }
        });

      /*  $(".qietu").click(function () {

            alert($(this).attr("name"));
            totalPage="10"
        })*/

    })


    function shan(obj){
        $.ajax({
            url:"http://localhost/deleteImage",
            type:"post",
            dataType:"json",
            data:{'imageId':obj.name},
            traditional: true,
            success:function(data){
                layer.alert('删除成功！',{
                    title: '提示框',
                    icon:1,
                });
                layer.close(index);
            },
            error:function(){
                alert("您没有相应的权限,请联系管理员");
            }
        })
        obj.parentNode.parentNode.parentNode.removeChild(obj.parentNode.parentNode);
    }

</script>

